import React, { useState, useRef } from 'react'
// cnpm i ahooks -S
import { useMount, useClickAway, useNetwork } from 'ahooks'
import './style.css'
function App() {
  const [ proList, setProList ] = useState([])

  useMount(() => {
    fetch('http://121.89.205.189/api/pro/list')
      .then(res => res.json())
      .then(res => {
        console.log(res)
        setProList(res.data)
      })
  })
  const networkState = useNetwork()
  const ref = useRef();
  useClickAway(() => {
    document.getElementById('tip').style.display = 'none'
  }, ref);
  return (
    <div>
      <div className="tip" id="tip">
        <span ref = { ref }>
          <span className="box"></span>
        </span>
      </div>
      { JSON.stringify(networkState) }
    </div>
  )
}

export default App
